<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<script src="<%=basePath %>js/Form validation/jquery-1.4.4.js" type="text/javascript"></script>
<link rel="stylesheet" href="<%=basePath %>css/bootstrap.css"/>
<link rel="stylesheet" href="<%=basePath %>css/buttons.css" />
<link type="text/css" rel="stylesheet" href="<%=basePath %>css/Form validation/validator.css"></link>
<script src="<%=basePath %>js/Form validation/formValidator-4.0.1.js" type="text/javascript" charset="UTF-8"></script>
<script src="<%=basePath %>js/Form validation/formValidatorRegex.js" type="text/javascript" charset="UTF-8"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
$(document).ready(function(){
	$.formValidator.initConfig({ formID: "form1", onError: function () { alert("校验没有通过，具体错误请看错误提示！") } });
		$("#fusername").formValidator({onShow:"请输入用户名",onFocus:"用户名5-20个字符",onCorrect:"该用户名可以注册"}).inputValidator({min:5,max:20,onError:"你输入的用户名非法,请确认"})
	    .ajaxValidator({
		dataType : "html",
		async : true,
		url: "<%=basePath %>userInfo/checkFusername?fusername=" + $("#fusername").val(),
		success: function(data){
	        if( data.indexOf("可以注册") > 0 ) return true;
	        if( data.indexOf("已被注册") > 0 ) return false;
			return false;
		},
		buttons: $("#button"),
		error: function(jqXHR, textStatus, errorThrown){alert("服务器没有返回数据，可能服务器忙，请重试"+errorThrown);},
		onError : "该用户名不可用，请更换用户名",
		onWait : "正在对用户名进行合法性校验，请稍候..."
	}).defaultPassed();
	$("#fpassword").formValidator({onShow:"请输入密码",onFocus:"长度6-20个字符",onCorrect:"密码输入正确"}).inputValidator({min:6,max:20,empty:{leftEmpty:false,rightEmpty:false,emptyError:"密码两边不能有空符号"},onError:"密码不能为空或长度不符，请确认"});
	$("#fpassword2").formValidator({onShow:"输再次输入密码",onFocus:"长度6-20个字符",onCorrect:"密码一致"}).inputValidator({min:6,max:20,empty:{leftEmpty:false,rightEmpty:false,emptyError:"重复密码两边不能有空符号"},onError:"重复密码不能为空或长度不符，请确认"}).compareValidator({desID:"fpassword",operateor:"=",onError:"2次密码不一致,请确认"});
	$("#fmailbox").formValidator({onShow:"请输入邮箱",onFocus:"邮箱6-100个字符",onCorrect:"输入正确",defaultValue:""}).inputValidator({onError:"您输入的邮箱长度非法,请确认"}).regexValidator({regExp:"^([\\w-.]+)@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.)|(([\\w-]+.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(]?)$",onError:"您输入的邮箱格式不正确"});
	$("#fealname").formValidator({onShow:"请输入真实姓名",onFocus:"长度4-10个字符",onCorrect:"真实姓名输入正确"}).inputValidator({min:4,max:10,empty:{leftEmpty:false,rightEmpty:false,emptyError:"两边不能有空符号"},onError:"姓名不能为空或长度不符，请确认"});
	$("#fcertificateno").formValidator({onShow:"请输入15或18位的身份证号",onFocus:"输入15或18位的身份证号",onCorrect:""}).functionValidator(/* {fun:isCardID} */)
	    .ajaxValidator({
		dataType: "html",
		async: true,
		url: "<%=basePath %>userInfo/checkFcertificateno?fcertificateno=" + $("#fcertificateno").val(),
		success: function(data){
	        if( data.indexOf("可以注册") > 0 ) return true;
	        if( data.indexOf("已被注册") > 0 ) return false;
			return false;
		},
		buttons: $("#button"),
		error: function(jqXHR, textStatus, errorThrown){alert("服务器没有返回数据，可能服务器忙，请重试"+errorThrown);},
		onError : "该身份证号不可用或已被注册",
		onWait : "正在对身份证号进行合法性校验，请稍候..."
	}).defaultPassed();
	$("#fweight").formValidator({onShow:"请输入体重",onFocus:"不能超过300(kg)",onCorrect:"输入合理"}).inputValidator({min:20,max:300,type:"value",onErrormin:"体重在20-300之间",onError:"体重输入不合理"}).defaultPassed();
	$("#fpasskey").formValidator({onShow:"请输入问题答案",onFocus:"长度不能超过20个字符",onCorrect:"输入正确"}).inputValidator({max:20,empty:{leftEmpty:false,rightEmpty:false,emptyError:""},onError:"问题答案长度过长"});
	$("#exit").click(function(){
		location.href = "<%=basePath %>index.jsp";
	});
});
</script>
<body onload="">
	<center>
		<br><br>
		<form action="userInfo/add" method="post" role="form" id="form1">
			<table width="800" cellpadding="0" border=0">
				<tr>
					<td align="right" width="300">用户名：</td>
					<td width="200"><input id="fusername" name="fusername" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fusernameTip" style="width:250px"></div></td>
				</tr>	
				<tr>
					<td align="right">密码：</td>
					<td><input type="password" id="fpassword" name="fpassword" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fpasswordTip" style="width:250px"></td>
				</tr>	
				<tr>
					<td align="right">确认密码：</td>
					<td><input type="password" id="fpassword2" name="fpassword2" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fpassword2Tip" style="width:250px"></td>
				</tr>	
				<tr>
					<td align="right">真实姓名：</td>
					<td><input id="fealname" name="fealname" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fealnameTip" style="width:250px"></div></td>
				</tr>
				<tr>
					<td align="right">性别：</td>
					<td>
						<label class="radio-inline">
							<input type="radio" name="fsex" id="inlineRadio1" value="男" checked="checked"> 男
						</label>
						<label class="radio-inline">
						  	<input type="radio" name="fsex" id="inlineRadio2" value="女"> 女
						</label>
					</td>			
					<td></td>
				</tr>
				<tr>
					<td align="right">身份：</td>
					<td>
						<select id="fidentity" name="fidentity" class="form-control" style="width:160px;height:30px;">
							<option value="成人">成人</option>
							<option value="学生">学生</option>
							<option value="残疾人、军人">残疾人、军人 </option>
							<option value="老年人">老年人</option>
						</select>
					</td>
					<td></td>
				</tr>
				<tr>
					<td align="right">身份证号：</td>
					<td><input id="fcertificateno" name="fcertificateno" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fcertificatenoTip" style="width:250px"></div></td>
				</tr>
				<tr>
					<td align="right">手机号：</td>
					<td><input id="fphonenumber" name="fphonenumber" class="form-control" style="width:160px;height:25px;"></td>
					<td></td>
				</tr>
				<tr>
					<td align="right">固定电话：</td>
					<td><input id="ffixedphone" name="ffixedphone" class="form-control" style="width:160px;height:25px;"></td>
					<td></td>
				</tr>
				<tr>
					<td align="right">地址：</td>
					<td><input id="faddress" name="faddress" class="form-control" style="width:160px;height:25px;"></td>
					<td></td>
				</tr>
				<tr>
					<td align="right">身高(cm)：</td>
					<td><input id="fheight" name="fheight" class="form-control" style="width:160px;height:25px;"></td>
					<td></td>
				</tr>
				<tr>
					<td align="right">体重(kg)：</td>
					<td><input id="fweight" name="fweight" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fweightTip" style="width:250px"></div></td>
				</tr>
				<tr>
					<td align="right">密码提示问题：</td>
					<td>
						<select id="fpassquestion" name="fpassquestion" class="form-control" style="width:160px;height:30px;">
							<option value="您的出生地是？">您的出生地是？</option>
							<option value="您的小学校名是？">您的小学校名是？</option>
							<option value="您的中学校名是？">您的中学校名是？ </option>
							<option value="您的大学校名是？">您的大学校名是？ </option>
							<option value="我最喜爱的小说？">我最喜爱的小说？ </option>
							<option value="我最喜爱的歌曲？">我最喜爱的歌曲？ </option>
							<option value="我最喜爱的食物？">我最喜爱的食物？ </option>
							<option value="我最大的爱好？">我最大的爱好？ </option>
						</select>
					</td>
					<td></td>
				</tr>
				<tr>
					<td align="right">问题答案：</td>
					<td><input id="fpasskey" name="fpasskey" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fpasskeyTip" style="width:250px"></td>
				</tr>
				<tr>
					<td align="right">邮箱：</td>
					<td><input id="fmailbox" name="fmailbox" class="form-control" style="width:160px;height:25px;"></td>
					<td><div id="fmailboxTip" style="width:250px"></div></td>
				</tr>
				<tr>
					<td colspan="4" align="center">
						<br>
						<input type="submit" value=" 注  册 " id="button" class="button button-pill button-primary" style="width:140px;height:40px;">&nbsp;&nbsp;&nbsp;&nbsp;
						<a href="<%=basePath %>index.jsp"><input type="button" value=" 返  回 " id="exit"  class="button button-pill button-primary" style="width:140px;height:40px;"></a>
					</td>
				</tr>
			</table>
		</form>
	</center>
</body>
</html>